@extends('layouts.admin-app')
@section('css')
  <link href="{{ asset('backend/assets/advanced-datatable/media/css/demo_page.css') }}" rel="stylesheet" />
  <link href="{{ asset('backend/assets/advanced-datatable/media/css/demo_table.css') }}" rel="stylesheet">
  <link href="{{ asset('backend/assets/fancybox/source/jquery.fancybox.css') }}" rel="stylesheet" />
    <link rel="stylesheet" type="text/css" href="{{ asset('backend/css/gallery.css') }}" />
@endsection
@section('content')

<section id="main-content">
          <section class="wrapper">
              <!-- page start-->
              <section class="panel">
                  <header class="panel-heading">
                      Image Galley
                  </header>
                  <div class="panel-body">
                      <ul class="grid cs-style-3">
                        @foreach($lists['item'] as $img)
                          <li>
                              <figure>
                                  <!-- <img src="{{ asset('backend/img/gallery/4.jpg') }}" alt="img04"> -->
                                  <img src="{{ $img['url'] }}" alt="{{ $img['name'] }}">
                                  <figcaption>
                                      <h3>{{ $img['name'] }}</h3>
                                      <span> </span>
                                      <a class="fancybox" rel="group" href="{{ $img['url'] }}">查看</a>
                                  </figcaption>
                              </figure>
                          </li>
                           @endforeach         
                      </ul>

                  </div>
              </section>

              <!-- page end-->
          </section>
      </section>
@endsection
@section('javascript')
<script src="{{ asset('backend/assets/fancybox/source/jquery.fancybox.js') }}"></script>
<script type="text/javascript" language="javascript" src="{{ asset('backend/assets/advanced-datatable/media/js/jquery.dataTables.js') }}"></script>
 <script type="text/javascript" charset="utf-8">
  $(function() {
    //    fancybox
    jQuery(".fancybox").fancybox();
  });
      
  function showImg(url) {

    var frameid = 'frameimg' + Math.random();

    console.debug(frameid);

    console.debug(url);

    window.img = '![](\)<script>window.onload = function() { parent.document.getElementById(\'' + frameid + '\').height = document.getElementById(\'img\').height+\'px\'; }<' + '/script>';
    document.write('<iframe id="' + frameid + '" src="javascript:parent.img;" frameBorder="0" scrolling="no" width="50%"></iframe>');

}
  </script>  
@endsection

